import React, {Component} from 'react';
import Register from "../register/register";
import {Button, InputItem, NavBar, TextareaItem} from "antd-mobile";
import HeaderSelect from "../../components/header-select/header-select";
import connect from "react-redux/es/connect/connect";
import {update} from "../../redux/actions";

class UserInfo extends Component {
    state = {
        userid :this.props.user._id,
        header: '', // 头像名称
        info: '', // 个人介绍
        post: '', // 职位名称
    }
    setHeader =(header) =>{
        this.setState({header});
    }
    handleChange = (text,val) => {
        this.setState({
            [text]:val
        });
    }

    render() {
        const  {user} = this.props
        if(user.header){
            return <Register to='/user' />
        }
        return (
            <div>
                <NavBar>用户信息完善</NavBar>
                <HeaderSelect setHeader={this.setHeader}></HeaderSelect>
                <InputItem onChange={(val) => {this.handleChange('post',val)}}>职位</InputItem>
                <TextareaItem  onChange={(val) => {this.handleChange('info',val)}} rows={3} title="介绍:"> </TextareaItem>
                <Button type='primary' onClick={ () => this.props.update(this.state)}>保存</Button>
            </div>
        );
    }
}

export default connect(
    state => ({user:state.user}),
    {update}
)(UserInfo);